import React from 'react';
import { Form, Input, Button, message, Space } from 'antd'
import { UserOutlined, LockOutlined, InsuranceOutlined } from '@ant-design/icons'
import '@/assets/css/login.scss'
import { useLocation, useNavigate } from 'react-router-dom';
import { login } from '@/api/url'

const Login = () => {
    const [form] = Form.useForm()
    const navigate = useNavigate()
    const onFinish = async (values) => {
        try {
            // const res = await login(values)
            message.success('登录成功')
            navigate('/taskList')
        } catch (e) {
            console.log(e)
        }
    }
    const Register = () => {

    }

    return (
        <div id="login">
            <Form
                form={form}
                name="normal_login"
                className="login-form"
                initialValues={{ remember: true }}
                onFinish={onFinish}
            >
                <Form.Item
                    name="account"
                    rules={[{ required: true, message: '请输入用户名' }]}
                >
                    <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="用户名" size="large" />
                </Form.Item>
                <Form.Item
                    name="password"
                    rules={[{ required: true, message: '请输入密码' }]}
                >
                    <Input
                        prefix={<LockOutlined className="site-form-item-icon" />}
                        type="password"
                        placeholder="密码"
                        size="large"
                    />
                </Form.Item>
                <Space style={{display:'flex',justifyContent:'center'}}>
                    <Form.Item>
                        {/* block,调整为父宽度 */}
                        <Button type="primary" className="login-form-button" block onClick={() => Register()}>
                            注册
                        </Button>
                    </Form.Item>
                    <Form.Item>
                        {/* block,调整为父宽度 */}
                        <Button type="primary" htmlType="submit"  className="login-form-button" block>
                            登录
                        </Button>
                    </Form.Item>
                </Space>

            </Form>
        </div>
    );
}

export default Login;
